<template>
	<view>
		<Navbar></Navbar>
		<view class="u-m-30 u-form-box">
			<u-form>
				<u-form-item required label-position="top" label="一、选择酒局中你希望在未来30天内去拜访或为他介绍客户的人">
					<view class="mission_box" @click="openCommonPopup(1)">
						<view>{{ visit.name || '请选择' }}</view>
						<u-icon name="arrow-right"></u-icon>
					</view>
				</u-form-item>
				<u-form-item required label-position="top" label="二、选择一位来友作为提醒员">
					<view class="mission_box" @click="openCommonPopup(2)">
						<view>{{ supervise.name || '请选择' }}</view>
						<u-icon name="arrow-right"></u-icon>
					</view>
				</u-form-item>
			</u-form>
		</view>
		
		<Modal :show="modal.show" :confirmText="modal.confirm" :cancelText="modal.cancel" :modalContent="modal.content"
			:showCancel="false" :maskAble="false" @confirm="modalConfirm" @cancel="modalCancel"></Modal>
			
		<!-- 通用选择框 -->
		<CommonPopup :popupShow="commonPopup.show" :list="commonPopup.list" @onChooseLabel="onChooseLabel" @popupClose="commonPopup.show = false"></CommonPopup>
		
		<Bottom @confirm="confirm"></Bottom>
	</view>
</template>

<script>
	import Navbar from '@/components/Navbar.vue'
	import Bottom from '@/components/Bottom.vue'
	import Modal from '@/components/Modal.vue'
	import CommonPopup from '@/components/CommonPopup.vue'
	import { teaPeopleList, teaTask, teaPeopleTask } from '@/network/tea.js'
	export default {
		components: {
			Navbar,
			Bottom,
			Modal,
			CommonPopup
		},
		data() {
			return {
				visit:{}, // 拜访
				supervise:{}, // 提醒
				commonPopup:{
					show: false,
					list:[],
					current: 0 /* 1拜访 2提醒 */
				},
				modal: {
					show: false,
					confirm: '申请',
					cancel: '取消',
					content: ''
				},
				tea_id: 0,
				isExamine: 0 // 0是详情进去  1是评价页面进入
			}
		},
		onLoad(options){
			if(options.isExamine){
				this.isExamine = options.isExamine
			}
			this.tea_id = options.id
			this.getUserTask()
		},
		methods:{
			getUserTask(){
				const params = {
					tea_id: this.tea_id,
					user_id: uni.getStorageSync("user_id"),
				}
				teaPeopleTask(params).then(res=>{
					if(res.data.one !== null){
						this.visit = res.data.one
					}		
					if(res.data.two !== null){
						this.supervise = res.data.two
					}
				})
			},
			/* 完整的人员列表 */
			getFullPeopleList(){
				const params = {
					tea_id: this.tea_id,
					user_id: uni.getStorageSync("user_id"),
					type: 1
				}
				teaPeopleList(params).then(res=>{
					if(res.data.list.findIndex(item=> item.id == uni.getStorageSync("user_id")) !== -1){
						res.data.list.splice(res.data.list.findIndex(item=> item.id == uni.getStorageSync("user_id")),1)
					}
					this.commonPopup.list = res.data.list
					this.commonPopup.show = true
				})
			},
			openCommonPopup(num){
				this.commonPopup.current = num
				switch(num){
					case 1:
					    this.commonPopup.list.length = 0
					    this.getFullPeopleList()
						break;
					case 2:
					    if(this.visit.name){
					    	this.commonPopup.list.map((item,index)=>{
					    		if(item.id == this.visit.id){
					    			this.commonPopup.list.splice(index,1)
					    		}
					    	})
					    	this.commonPopup.show = true
					    }else{
					    	uni.showToast({
					    		title: "请先完成第一项",
					    		icon: "none"
					    	})
					    }
						break;
				}
			},
			onChooseLabel(val){
				switch(this.commonPopup.current){
					case 1:
					    this.visit = val
						this.supervise = {}
						break;
					case 2:
					    this.supervise = val
						break;
				}
				this.commonPopup.show = false
			},
			confirm(){
				if(this.visit.id && this.supervise.id){
					const params = {
						tea_id: this.tea_id,
						user_id: uni.getStorageSync("user_id"),
						from_user_id_one: this.visit.id,
						from_user_id_two: this.supervise.id
					}
					teaTask(params).then(res=>{
						this.modal.content = '任务领取成功'
						this.modal.confirm = '确定'
						this.modal.show = true
					})
				}else{
					uni.showToast({
						title: "必填项不能为空",
						icon: "none"
					})
				}
			},
			modalConfirm(){
				uni.navigateBack({
					delta: this.isExamine == 1 ? 2 : 1
				})
			},
			modalCancel(){
				this.modal.show = false
				uni.navigateBack({
					delta: this.isExamine == 1 ? 2 : 1
				})
			}
		}
	}
</script>

<style scoped>
	.mission_box {
		display: flex;
		justify-content: space-between;
		background: #F2F5FA;
		border-radius: 10rpx;
		padding: 0 20rpx;
		height: 80rpx;
		line-height: 80rpx;
		color: #868B9A;
	}
</style>